<include file="public@header" />
    <style>
        .clear{
            clear:both;
        }
        .clear::after{
            clear:both;
            content: " ";
            display: table;
        }
        .list{}
        .list ul{}
        .list ul li{
            list-style:none;
            float:left;
            margin-right:10px;
            width:360px;
        }
        .list ul li .title{
            line-height:30px;
        }
        .list ul li .view{
            float:left;
            width:180px;
            
        }
        .list ul li .view .name{
            line-height:30px;
        }
        .list ul li .view .view_b{
            width:180px;
            height:320px;
        }
    </style>
    <script src="//cdn.jsdelivr.net/npm/xgplayer@1.1.4/browser/index.js" charset="utf-8"></script>
    <script src="//cdn.jsdelivr.net/npm/xgplayer-flv.js/browser/index.js" charset="utf-8"></script>
    
</head>
<body>
	<div class="wrap">
		<ul class="nav nav-tabs">
			<li class="active"><a >列表</a></li>
		</ul>
        
        <div class="list">
            <ul>
                <foreach name="list" item="vo">
                <li>
                    <div class="title">类型：{$type[$vo['type']]}</div>
                    <div class="title">通话时长：{$vo['length']}</div>
                    <div class="title">
                        <a class="btn btn-danger" href="javascript:closeRoom('{$vo['id']}');">关闭</a>
                    </div>
                    <div class="clear">
                        <div class="view">
                            <div class="name">用户：{$vo['userinfo']['user_nickname']} ({$vo['uid']})</div>
                        </div>
                        <div class="view">
                            <div class="name">主播：{$vo['liveinfo']['user_nickname']} ({$vo['liveuid']})</div>
                        </div>
                    </div>
                    <div class="clear">
                        <div class="view">
                            <div class="view_b" id="mse_{$vo['uid']}"></div>
                            <script>
                              new FlvJsPlayer({
                                "id": "mse_{$vo['uid']}",
                                "url": "{$vo['pull_user']}",
                                "playsinline": true,
                                "whitelist": [""],
                                "autoplay": true,
                                "volume": 0.4,
                                "width": 180,
                                "height": 320
                                
                              });
                            </script>
                        </div>
                        <div class="view">
                            <div class="view_b" id="mse_{$vo['liveuid']}"></div>
                            <script>
                              new FlvJsPlayer({
                                "id": "mse_{$vo['liveuid']}",
                                "url": "{$vo['pull_live']}",
                                "playsinline": true,
                                "whitelist": [""],
                                "autoplay": true,
                                "volume": 0.4,
                                "width": 180,
                                "height": 320
                              });
                            </script>
                        </div>
                    </div>
                    
                </li>
                </foreach>
            </ul>
        </div>
        <div class="pagination">{$page}</div>
	</div>
	<script src="__STATIC__/js/admin.js"></script>
    <script type="text/javascript">
        function closeRoom(roomId){
            $.ajax({
                async: false,
                url: '{:url('Monitor/stopRoom')}',
                data:{id:roomId},
                dataType: "json",
                success: function(data){
                    console.log(data);
                    if(data.status ==0){
                        alert(data.info);
                    }else{
                        alert("房间已关闭");
                        location.reload();
                    }
                },
                error:function(XMLHttpRequest, textStatus, errorThrown){
                    alert('关闭失败，请重试');
                }
            });
        }
    </script>
</body>
</html>